{% extends 'base.html' %}
{% block content %}
    <form action="{% url 'begin' %}" method="post" role='form'>
        {% csrf_token %}
        <div class="form-group">
            <label for="exampleInputPassword1">User Name</label>
            <input class="form-control" id="exampleInputPassword1" name="username">
        </div>
        <div class="form-group">
            <label for="exampleInputPassword1">Email</label>

            <input type="email" class="form-control" id="exampleInputPassword1" name="email">
        </div>
        <div class="form-group">
            <label for="exampleInputPassword1">New Password</label>
            <input class="form-control" name="password" id="password1">
        </div>
        <div class="form-group">
            <label for="exampleInputPassword2">Confirm Password</label>
            <input class="form-control" id="password2">
        </div>
        <script>
            function check() {
                var password1 = $('#password1').val();
                var password2 = $('#password2').val();
                if (password1 == password2) {
                    return true;
                } else {
                    alert("Two passwords do not match");
                    return false;
                }
            }
        </script>
        <button type="submit" class="btn btn-primary" onclick=check()>Save and continue adding</button>
    </form>
{% endblock %}
